<template>
	<view class="cart-page">
		<view class="title">
			<view class="bg" :class="title != '' ? 'bg-color' : ''">

				<u-icon @click="goBack" size="36" name="arrow-left"></u-icon>
				<text>{{title}}</text>
				<view class="">
				</view>
			</view>

		</view>

		<scroll-view scroll-y="true" class="scroll-Y">
			<view class="">

				<view class="container-box">
					<view class="addressno" @click="goAdd">
						<view class="">
							<view class="" style="display: flex; align-items: center;">
								<!-- <image src="../../static/home/one.png" mode=""></image> -->
								<text>{{seleAddress!=''?seleAddress :'请先选择地址和配送方式，再确认订单信息'}}</text>
							</view>
							<view class="no-bot" v-if="addressInfo.name">
								<text style="margin-right: 15rpx;">{{addressInfo.name}}</text>
								<text>{{addressInfo.mobile}}</text>
							</view>
						</view>

						
						<image class="right-img" :src="right" mode=""></image>
					</view>

				</view>
			</view>





			<view class="cart-box" v-for="item in cartData" :key="item.id">

				<view class="cart-item">
					<image :src="item.goods.photoUrl.split(',')[0]" class="item-image" />
					<view class="actions-main">
						<view class="item-details">
							<text>{{ item.goods.title }}</text>

						</view>
						<view class="main-item">
							<view class="box-text">
								￥
								<text>{{ item.goods.price || 0 }}</text>
							</view>

							<view class="box-text all-text">
								x
								<text class="all-text">{{item.count}}</text>
							</view>
						</view>
					</view>
				</view>




			</view>


			<!--<view class="box">
				 <view class="box-one">
					<text>配送方式</text>
					<view class="" v-if="selectedDelivery=='pickup'">
						到院自提
					</view>
					<view class="" v-if="totalPrice<1000 && selectedDelivery!='pickup'">
						快递<text>￥{{freight[1].dictValue}}</text>
					</view>
					<view v-if="totalPrice>1000 && selectedDelivery!='pickup'">
						免运费
					</view>
				</view> -->
				<!-- <view class="box-one">
					<text>订单备注</text>
					<view class="">
						无
					</view>
				</view> -->
				<!-- <view class="box-one">
					<text>发票</text>
					<view class="">
						请填写开票信息
					</view>
				</view> 
			</view>-->
			<view class="box">
				<view class="box-one">

					<view class="one-text">
						商品数量<text>共{{cartData.length || 0}}件商品</text>
					</view>

					<view class="" v-if="selectedDelivery!='pickup'">
						￥{{(Number(totalPrice) && !isNaN(Number(totalPrice))) ? (Number(totalPrice) < 1000 ? (Number(totalPrice) + Number(freight[1].dictValue)).toFixed(2) : Number(totalPrice)) : 0}}
					</view>



					<view v-else class="">
						￥{{ Number(totalPrice)  }}
					</view>
				</view>
				<view class="box-one one-bor">






					<view class="" v-if="selectedDelivery=='pickup'">
						到院自提
					</view>
					<text v-if="totalPrice<1000 && selectedDelivery!='pickup'">运费</text>
					<view v-if="totalPrice<1000 && selectedDelivery!='pickup'" class="">
						+ ￥{{freight[1].dictValue}}
					</view>
					<view class="" v-if="totalPrice>1000 && selectedDelivery!='pickup'">
						免运费
					</view>
				</view>
				<view class="box-one two-bor">

					<view class="">
						合计：<text v-if="selectedDelivery!='pickup'"
							class="all">￥{{(Number(totalPrice) && !isNaN(Number(totalPrice))) ? (Number(totalPrice) < 1000 ? (Number(totalPrice) + Number(freight[1].dictValue)).toFixed(2) : Number(totalPrice)) : 0}}</text>
						<text v-else class="">
							￥{{ Number(totalPrice)  }}
						</text>
					</view>
				</view>
			</view>

			<!-- <view class="box" v-if="statusValue!=104 && statusValue!=103">
				<view class="box-one">
					<view class="">
						订单编号：{{ orderDetails.orderNumber }}
						<text class="copy" @click="copyText">复制</text>
					</view>
				</view>
				<view class="box-one">

					<view class="">
						创建时间：{{orderDetails.createTime}}
					</view>
				</view>
				<view class="box-one" v-if="statusValue==101">

					<view class="">
						支付时间：2024-11-30 15:32:00
					</view>
				</view>
			</view> -->

		</scroll-view>




		<!-- 结算区域 -->
		<view class="bot-tom">
			<view class="bot-btn">
				<view class="checkout">
					<view class="">
						<view class="yunfei">
							<text class="yun" v-if="selectedDelivery!='pickup'">{{totalPrice<1000?'含运费':'免运费'}}</text>
							<text class="total">合计:</text>
							<view class="box-text">
								￥
								<text v-if="selectedDelivery!='pickup'"
									class="all">￥{{(Number(totalPrice) && !isNaN(Number(totalPrice))) ? (Number(totalPrice) < 1000 ? (Number(totalPrice) + Number(freight[1].dictValue)).toFixed(2) : Number(totalPrice)) : 0}}</text>
								<text v-else class="">
									￥{{ Number(totalPrice)  }}
								</text>
							</view>
						</view>
					</view>
					<view class="delete-btn" @click="checkout">结算</view>
				</view>

			</view>
		</view>



	</view>
</template>

<script>
	import {
		toast,
		getStore
	} from "../../utils";
	import {
		applyGoods,
		address,
		getregistration,
		goodsOrderDetails,
		setGoodspay,
		setGoodsOrder

	} from '../../service/api.js'
	import config from "../../utils/config";
	export default {
		data() {
			return {

				right:config.ossHost +"2025/01/09/ee1bcb20aa0b4ae5a14ad5dce09c3ba6.png",


				url: "/integration/shopCar/index",
				show: false,
				isRefund: 0,
				title: "确认订单",
				seleAddress: "",
				orderDetails: {},
				totalPrice: 0,
				// 模拟的购物车数据
				cartData: [],
				orderData: {},
				statusValue: 0,
				order: false,
				isAllSelected: false, // 是否全选
				isEditMode: false,
				refundParams: {
					id: "",
					refundCause: ""
				},
				info: {},
				setpaygoods: [],
				caseList: [],

				status: [],
				refundText: "",
				addressInfo: {},
				freight: [],
				selectedDelivery: "",
				zt: 0,
			};
		},
		computed:{
			
		},
		onShow() {
			this.token = getStore("token") || null;
			this.cartData = JSON.parse(getStore('selectedItems'))
			this.totalPrice = JSON.parse(getStore('totalPrice'))
			console.log(this.cartData, "ASLKFHKASDJF;HJ;FKHDS;KJFHASDKJFHS LDFJHASDFJHKADJS")
			if (this.cartData.length > 0) {

				this.totalcount = this.totalcounts(this.cartData)
				console.log(this.totalcount, "这里是否拿到")

			}



			this.info = JSON.parse(getStore("info")) || {};
			if (!this.token) {
				this.show = true
			}
			//赋值用户id

		},

		onLoad(options) {
			
			this.getcarriage();
			if(!options.isaddress){
				this.getaddress();
			}
			
			if (options.addressInfo) {
				console.log(JSON.parse(options.addressInfo))
				this.addressInfo = JSON.parse(options.addressInfo);
				this.addressId = this.addressInfo.id;
				this.seleAddress = this.addressInfo.shippingAddress + this.addressInfo.address;
			}
			this.info = JSON.parse(getStore("info")) || {};
			if (options.item) {
				this.cartData = JSON.parse(options.item);
				this.totalcount = this.totalcounts(this.cartData)
			}
			if (options.totalPrice) {
				this.totalPrice = options.totalPrice;

			}
			this.selectedDelivery = options.selectedDelivery;

		},
		computed: {

		},
		methods: {
			goBack() {
				uni.navigateBack({
					delta: 1,
				});
				// uni.navigateTo({
				// 	url: `/integration/shopCar/index`
				// })
			},


			//获取运费价格
			async getcarriage() {
				let res = await getregistration("carriage");
				if (res.code == 200) {
					this.freight = res.rows;

				}
			},

			//结算
			async checkout() {
				if (this.seleAddress == "") {
					uni.showToast({
						title: '请选择地址和配送方式',
						icon: 'none'
					});
					return;
				}
				//这里是将购物车数据以数组传递，商品id、商品数量、用户id、地址id
				if (this.selectedDelivery == 'express') {
					this.zt = 0;
				} else {
					this.zt = 1;
				}

				this.setpaygoods =
					this.cartData
					.filter(item => item.selected)
					.map(item => ({
						//商品id
						id: item.goods.id,
						//商品数量
						count: item.count,
						//用户id
						memberId: this.info.id,
						//地址id
						addressId: this.addressId,
						//购物车订单id
						carId: item.id,
						zt: this.zt
					}));



				let res = await setGoodsOrder(this.setpaygoods);
				if (res.code == 200) {
					console.log(res, "1111111111111")
					this.paySign(2, res)

				}

			},



			//获取地址
			async getaddress() {
				let res = await address();
				if (res.code == 200) {
					this.caseList = res.data.records;

					let defaultCases = this.caseList.filter(item => item.isDefault === 1);

					if (defaultCases.length > 0) {
						this.isHeight = true
						this.address = false;
						this.popupHeight = "1200rpx";
						this.addressInfo = defaultCases[0];
						//赋值地址id给新增订单参数
						this.addressId = defaultCases[0].id;
						this.seleAddress = defaultCases[0].shippingAddress + defaultCases[0].address;

					}

				}
			},
			//跳转地址
			goAdd() {
				uni.navigateTo({
					url: `/My/address/index?select=true`
				})
			},



			totalcounts(data) {
				console.log(data, "这里是什么东西");
				return data.reduce((total, item) => {
					if (item.selected && item.count && item.count !== undefined) {
						return total + item.count;
					}
					return total;
				}, 0);
			},

			//获取商城订单状态
			async getStatus(id) {
				let res = await getregistration("commodity_status");
				if (res.code == 200) {
					this.status = res.rows;
					this.getOrderList(id);
					// consoloe.log(this.status, )
				}
			},

			//支付
			async paySign(index, item) {
				if (index == "1") {
					toast("支付宝支付暂未开放");
					return;
				}
				try {
					let params = {
						payType: index, //支付类型1:支付宝 2:微信
						orderNo: item.data.orderNumber,
					};
					let res = await setGoodspay(params);
					if (res.message == "未绑定微信！") {
						this.payBtnFlag = false;
						toast(res.message);
						setTimeout(() => {
							uni.navigateTo({
								url: "/My/setting",
							});
						}, 1500);
						return;
					}
					let data = res.data;
					uni.requestPayment({
						provider: "wxpay",
						timeStamp: data.timeStamp,
						nonceStr: data.nonceStr,
						package: data.package,
						signType: data.signType,
						paySign: data.paySign,
						success: (res) => {
							if (res.errMsg === "requestPayment:ok") {
								toast("支付成功，耐心等候");
								uni.navigateTo({
									url: '/integration/paymentSuccess/index'
								})
							}
						},
						fail: (err) => {
							toast("支付失败");
							setTimeout(() => {
								uni.navigateTo({
									url: `/My/order/index?status=1`
								})
							}, 1500);
						},
					});
				} catch (error) {

				}
			},












			copyText() {
				// 使用 uni.setClipboardData 将文本复制到剪贴板
				uni.setClipboardData({
					data: this.orderDetails.orderNumber,
					success: () => {
						uni.showToast({
							title: '复制成功',
							icon: 'success'
						});
					},
					fail: (err) => {
						uni.showToast({
							title: '复制失败',
							icon: 'none'
						});
						console.log(err);
					}
				});
			},





		}
	};
</script>

<style lang="scss" scoped>
	.box {
		margin: 0 24rpx;
		font-size: 24rpx;
		background: #FFFFFF;
		padding: 24rpx;
		border-radius: 8rpx;
		margin-bottom: 24rpx;

		.box-one {
			display: flex;
			justify-content: space-between;
			margin-bottom: 24rpx;



			text {

				color: #808080;
			}

			view {
				font-weight: bold;
			}

			.copy {
				display: inline-block;
				width: 52rpx;
				height: 34rpx;
				line-height: 34rpx;
				text-align: center;
				border-radius: 4rpx 4rpx 4rpx 4rpx;
				border: 1rpx solid #E6E6E6;
			}

			.all {
				font-weight: bold;
				font-size: 28rpx;
				color: #FF7C54;
			}
			.one-text{
				font-size: 28rpx;
			}
		}

		.one-bor {
			
			padding-bottom: 24rpx;
			border-bottom: 1rpx solid #E6E6E6;
		}

		.box-one:last-child {
			margin-bottom: 0;
		}
		.two-bor{
			justify-content: flex-end;
		}
	}

	.pop-tit {
		text-align: center;
		padding: 40rpx 0;
		font-size: 32rpx;
		color: #1A1A1A;
		border-bottom: 1rpx solid #E6E6E6;

	}

	.top {
		display: flex;

		align-items: center;
		font-weight: bold;
		font-size: 28rpx;

		image {
			width: 72rpx;
			height: 72rpx;
			margin-right: 10rpx;
		}

		.top-box {
			display: flex;
			align-items: center;
			margin-left: 48rpx;
			margin-bottom: 24rpx;

			.text-co {
				margin-top: 15rpx;
				color: #808080;
				font-size: 24rpx;
			}


		}
	}

	.refund-btn {
		width: 702rpx;
		height: 80rpx;
		margin: auto;
		margin-top: 15rpx;
		display: flex;
		justify-content: space-between;

		.butt {
			width: 339rpx;
			height: 80rpx;
			border-radius: 8rpx;
			background: #CCA566;
			color: #FFFFFF;
			text-align: center;
			line-height: 80rpx;
		}

		.butts {
			color: #CCA566;
			background: #fff;
			border: 2rpx solid #CCA566;
		}
	}

	.popup-box {
		.refundBox {
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 24rpx;
			font-size: 24rpx;
			border-bottom: 1rpx solid #E6E6E6;
		}

		.refundBox:last-child {
			border-bottom: none;
		}


	}


	.container-box {
		padding: 24rpx;
		background: #fff;
		margin: 0 24rpx 24rpx 24rpx;
		font-size: 28rpx;
		font-weight: bold;
		border-radius: 8rpx;

		.addressno {
			display: flex;
			align-items: center;
			justify-content: space-between;
			align-items: center;

			image {
				width: 27rpx;
				height: 31rpx;
			}

			.no-bot {
				display: flex;
				align-items: center;
				font-size: 24rpx;
				font-weight: 100;
				color: #808080;
			}
		}

		.info-card {
			display: flex;
			justify-content: space-between;
			align-items: center;

			.info {
				font-weight: 100;
				color: #808080;

				text:last-child {
					margin-left: 10rpx;
				}
			}
		}
	}

	.title {
		background: #fff;
	}

	.scroll-Y {
		height: calc(100vh - 356rpx);
		padding-top: 24rpx;

		// width: 702rpx;
		// margin: auto;
		.deliver {
			display: flex;
			font-weight: bold;
			justify-content: space-between;
			align-items: center;
			margin-bottom: 24rpx;

			image {
				width: 30rpx;
				height: 30rpx;
			}

			.deliver-tit {
				margin-left: 10rpx;
				color: #FF7C54;
			}

			.deliver-text {
				width: 450rpx;
				white-space: nowrap;
				/* 防止文本换行 */
				overflow: hidden;
				/* 隐藏超出容器的部分 */
				text-overflow: ellipsis;
				/* 超出部分显示省略号 */
			}
		}
	}


	.actions-main {
		height: 180rpx;
		width: 450rpx;
		display: flex;
		flex-direction: column;

		.main-item {
			display: flex;
			justify-content: space-between;
		}
	}

	.actions-box {
		display: flex;
		justify-content: space-between;



	}



	.cart-page {}

	.cart-box {
		margin: 0 24rpx;
		margin-bottom: 24rpx;
		background: #FFFFFF;
		border-radius: 16rpx;

		.cart-tit {
			padding: 24rpx 24rpx 0rpx 24rpx;
			font-size: 24rpx;
			font-weight: bold;
		}

		.cart-item {

			display: flex;
			align-items: center;
			padding: 24rpx;

		}

		.refund-box {
			display: flex;
			justify-content: flex-end;

			.refund {
				margin: 24rpx 24rpx 24rpx 0;
				padding: 12rpx 0;
				width: 144rpx;
				text-align: center;
				border-radius: 8rpx 8rpx 8rpx 8rpx;
				font-size: 24rpx;
				color: #1A1A1A;
				border: 1rpx solid #E6E6E6;
			}
		}
	}





	.item-image {
		width: 180rpx;
		height: 180rpx;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		margin-right: 16rpx;
	}

	.item-details {
		flex: 1;
	}



	button {
		margin: 5px;
	}

	.select-all {
		display: flex;
		align-items: center;

	}

	.delete-btn {
		width: 168rpx;
		height: 70rpx;
		background: #CCA566;
		border-radius: 4rpx 4rpx 4rpx 4rpx;
		text-align: center;
		line-height: 70rpx;
		margin-left: 16rpx;
		color: #FFFFFF;
	}

	.checkout {
		display: flex;
		align-items: center;
		// background-color: #f1f1f1;

	}

	.checkout button {
		width: 100%;
		padding: 10px;
		background-color: #ff6600;
		color: white;
		border: none;
	}

	.bot-btn {
		display: flex;
		justify-content: flex-end;
		align-items: center;



		.yunfei {
			display: flex;
			font-size: 24rpx;
			color: #1A1A1A;
			align-items: baseline;

			.yun {
				color: #808080;
			}

			.total {}

		}
	}

	.box-text {

		color: #FF7C54;

		text {
			font-weight: bold;
			font-size: 32rpx;
		}
	}

	.all-text {

		color: #808080;

		text {
			font-weight: 100;
		}
	}

	.bot-tom {
		position: fixed;
		padding: 24rpx;
		background: #fff;
		left: 0;
		right: 0;
		bottom: 0;
		width: 702rpx;
		height: 120rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
	}

	.btn {
		position: fixed;
		bottom: 0;
		z-index: 100;
		left: 0;
		right: 0;

		width: 750rpx;
		height: 168rpx;
		background: #FFFFFF;
		box-shadow: 0rpx -1rpx 0rpx 0rpx rgba(206, 190, 165, 0.2);
		border-radius: 0rpx 0rpx 0rpx 0rpx;

		.btn-box {
			width: 702rpx;
			height: 80rpx;
			margin: auto;
			margin-top: 15rpx;
			display: flex;
			justify-content: space-between;

			.btn-right {
				width: 620rpx;
				display: flex;
				align-items: center;
				justify-content: space-between;
			}

			image {
				width: 48rpx;
				height: 48rpx;
				margin-bottom: 5rpx;
			}

			.left-kefu {
				position: relative;
				display: flex;
				flex-direction: column;
				align-items: center;
				margin-right: 20rpx;
				width: 48rpx;
				height: 80rpx;

				button {
					width: 48rpx;
					height: 60rpx;
					position: absolute;
					top: 0;
					left: 0;
					opacity: 0;
				}

				text {
					font-size: 24rpx;
				}
			}

			.butt {
				width: 295rpx;
				height: 80rpx;
				border-radius: 8rpx;
				background: #CCA566;
				color: #FFFFFF;
				text-align: center;
				line-height: 80rpx;
			}

			.butts {
				color: #CCA566;
				background: #fff;
				border: 2rpx solid #CCA566;
			}
		}

		.connection-box {
			width: 702rpx;
			height: 80rpx;
			margin-top: 15rpx;
			margin: auto;
			position: relative;

			.connection {
				line-height: 80rpx;
				text-align: center;
				color: #FFFFFF;
				font-size: 32rpx;
				width: 702rpx;
				height: 80rpx;
				background: #CCA566;
				border-radius: 8rpx 8rpx 8rpx 8rpx;


			}

			.swipers-btn {
				position: absolute;
				top: 0;
				left: 0;
				right: 0;
				opacity: 0;
				width: 702rpx;
				height: 80rpx;
			}
		}

	}

	.checkbox {
		width: 30rpx;
		height: 30rpx;
		border: 1rpx solid #ccc;
		border-radius: 50%;
		margin-right: 24rpx;
		display: flex;
		justify-content: center;
		align-items: center;

		cursor: pointer;
		background-color: white;
	}

	.checkbox.selected {
		border: 1rpx solid #CCA566;
		background-color: #CCA566;
	}

	.item-image {
		width: 180rpx;
		height: 180rpx;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		margin-right: 16rpx;
	}

	.but-box {
		position: relative;

		.swipers-btn {
			position: absolute;
			top: -6px;
			left: -6px;
			opacity: 0;
			width: 296rpx;
			height: 87rpx;
		}
	}
	.bg {
		width: 100%;
		height: 120rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 24rpx;
		padding-top: 65rpx;
	
	
		.title-img {
			width: 100rpx;
		}
	
		text {
			display: inline-block;
	
			color: #1a1a1a;
			font-size: 32rpx;
			font-weight: bold;
		}
	
		view {
			width: 100rpx;
		}
	}
	
	.bg-color {
		// background: #fff;
	}
	.one-text{
		font-size: 28rpx;
		color:#808080;
		text{
			font-size: 24rpx;
		}
	}
	.right-img{
		width: 30rpx !important;
		height: 30rpx !important;
	}
</style>